<template>
	<view class="content">
		<u-navbar bgColor="transparent" titleStyle="color:#fff" title="实名认证" leftIconColor="#fff" :autoBack="true"
			:placeholder="true">
		</u-navbar>
		<view class="entry">
			<view class="content-title">
				姓名：
			</view>
			<u--input maxlength="5" border="none" color="#fff" v-model="name" placeholder="请输入您的姓名"></u--input>
		</view>
		<view class="entry">
			<view class="content-title">
				身份证号码：
			</view>
			<u--input maxlength="20" border="none" color="#fff" v-model="card" placeholder="请输入您的身份证号码"></u--input>
		</view>
		<view class="btn">
			<u-button size="large" v-if="isshow == 2" style="color: #000;" @click="gobuy"
				color="linear-gradient( 90deg, #C8F673 0%, #98F083 100%)" type="primary" text="提交"
				shape="circle"></u-button>
			<u-button size="large" v-if="isshow == 0" style="color: #000;"
				color="linear-gradient( 90deg, #C8F673 0%, #98F083 100%)" type="primary" text="显示已提交，等待审核"
				shape="circle"></u-button>
			<u-button size="large" v-if="isshow == 1" style="color: #000;"
				color="linear-gradient( 90deg, #C8F673 0%, #98F083 100%)" type="primary" text="已实名"
				shape="circle"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name: '',
				card: '',
				isshow: 2
			}
		},
		onLoad() {
			this.realNameInfo()
		},
		methods: {
			gobuy() {
				if (this.name == '') {
					uni.showToast({
						title: '姓名不能为空！',
						icon: 'none'
					})
					return
				}
				if (this.card == '') {
					uni.showToast({
						title: '身份证不能为空！',
						icon: 'none'
					})
					return
				}
				uni.showLoading({
					mask: true
				})
				let params = {
					id_card: this.card,
					name: this.name
				}
				this.$Request({
					method: 'POST',
					url: '/api/Personal/realNamePost',
					data: params
				}).then(res => {
					uni.hideLoading()
					if (res.code == 1) {
						uni.showToast({
							title: '实名成功！',
							icon: 'none'
						})
						this.realNameInfo()
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			realNameInfo() {
				let params = {

				}
				this.$Request({
					method: 'POST',
					url: '/api/Personal/realNameInfo',
					data: params
				}).then(res => {
					if (res.code == 1) {
						if (res.data != null) {
							this.isshow = res.data.status
							this.name = res.data.real_name
							this.card = res.data.id_card
						}
					}
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #17191A;
	}
</style>
<style scoped lang="scss">
	.content {
		width: 100%;
		min-height: 100vh;
		background-image: url('/static/my/my-bg.png');
		background-repeat: no-repeat;
		background-size: 100% 568rpx;
		padding: 30rpx;

		.entry {
			padding: 30rpx;
			background-color: rgba(238, 238, 238, 0.2);
			border-radius: 50rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			font-size: 28rpx;
			margin-top: 30rpx;

			.content-title {
				font-size: 28rpx;
				color: #fff;
				margin-right: 20rpx;
			}
		}

		.btn {
			margin-top: 60rpx;
		}
	}
</style>